<template>
	<div v-if="info && info.length > 0">
		<div class="valuation" v-for="(item,index) in info" :key="index">
			<div class="flex flex-v-c">				
				<div class="face">
					<img-box class="classImg" :isBr50="isBr50"  :img-url="item.Face" />
				</div>
				<div class="ml-24">
					<div class="color-black fw-b fs-28">{{ item.UserName }}</div>
					<div class="color-gray7">{{ item.AddTime }}</div>
				</div>
			</div>
			<div class="flex mt-24">
				<div>
					<img v-for="item in item.Star" src="@/assets/images/physio/satis.png" class="is-32 mr-12" />
					<img v-if="item.Star != 5" v-for="item in (5 - item.Star)" src="@/assets/images/physio/dissatis.png" class="is-32 mr-12" />
				</div>
			</div>
			<div class="fs-28 mt-24 text-show-line-2">{{ item.Content }}</div>
		</div>
	</div>
</template>
<script>
import imgBox from 'components/imgBox'
export default {
	components: {
    imgBox
  },
	props:{
		info:{
			type: Array
		}
	},
	data() {
    return {
			artificerUserId: 0,
			list:[],
			pageIndex: 1,
			pageSize: 3,
			isBr50: true,			
		}
	},
	created(){
		console.log("222")
		this.info.forEach((ele) => {
			ele.UserName = this.formattedName(ele.UserName)
		})
	},
	methods:{
		formattedName(val){
			return val.substring(0,1) + new Array(3).join('*')
		}
	}
}
</script>

<style lang="scss" scoped>
.valuation{
	padding-bottom: 24px;
	margin-bottom: 24px;
	border-bottom: 2px solid #F2F3FC;
}
.valuation:last-child{
	border-bottom: none;
}
.face{
	width: 72px;
}

</style>

